
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>员工统计表</title>
    <link rel="stylesheet" href="/static/js/plugins/jquery-easyui/themes/default/easyui.css">
    <link rel="stylesheet" href="/static/js/plugins/jquery-easyui/themes/icon.css">
    <!--jquery必须在easyui之前导入  -->
    <script src="/static/js/plugins/jquery-easyui/jquery.min.js"></script>
    <script src="/static/js/plugins/jquery-easyui/jquery.easyui.min.js"></script>
    <script src="/static/js/plugins/jquery-easyui/locale/easyui-lang-zh_CN.js"></script>
    <%--<script type="text/javascript" src="/static/js/system/saleNalyze.js"></script>--%>
    <script type="text/javascript" src="/static/js/plugins/echarts/echarts-all.js"></script>
</head>
<body>
<!-- 为ECharts准备一个具备大小（宽高）的Dom -->
<div id="main" style="height:100%;width:100%;"></div>
<script type="text/javascript">

    //	基于准备好的dom，初始化echarts实例
    var myChart = echarts.init(document.getElementById('main'));

    // 指定图表的配置项和数据
    var option = {
        title : {
            text: '员工报表',
            subtext: '${groupByType}',
            x:'center',
        },
        tooltip : {
            trigger: 'axis'
        },
        legend: {
            data:['员工报表'],
            x:'left'
        },
        toolbox: {
            show : true,
            feature : {
                mark : {show: true},
                dataView : {show: true, readOnly: false},
                magicType : {show: true, type: ['line', 'bar']},
                restore : {show: true},
                saveAsImage : {show: true}
            }
        },
        calculable : true,
        xAxis : [
            {
                type : 'category',
                //data : ${groupByTypes}
                data :  ["总员工人数","男","女","20以下","20-30","30-40","40-50","50以上","博士","硕士","本科","大专","中专","高中","高中以下"]
            }
        ],
        yAxis : [
            {
                type : 'value'
            }
        ],
        series : [
            {
                name:'员工报表',
                type:'bar',
               // data:${totalAmounts},
                "data":[50, 20, 30, 20, 30, 10,15,15,5,5,5,15,15,5,3,2],
                markPoint : {
                    data : [
                        {type : 'max', name: '最大值'},
                        {type : 'min', name: '最小值'}
                    ]
                },
                markLine : {
                    data : [
                        {type : 'average', name: '平均值'}
                    ]
                }
            }
        ]
    };


    // 将给option替换成对应的报表数据配置即可

    // 使用刚指定的配置项和数据显示图表。
    myChart.setOption(option);
</script>
</body>
</html>
